<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<%@page import="java.util.List"%>
<%@page import="java.util.Map"%>
<%@page import="java.util.ArrayList"%>
<%@page import="java.util.HashMap"%>

<%
    String webPath = request.getContextPath();
    // 
    List<Map<String,String>> list = new ArrayList<Map<String,String>>();
    Map<String,String> map1 = new HashMap<String,String>();
    Map<String,String> map2 = new HashMap<String,String>();
    map1.put("id","100");
    map1.put("name","张三");
    map2.put("id","122");
    map2.put("name","李四");
    list.add(map1);
    list.add(map2);
%>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>json</title>
<script type="text/javascript">
var webPath = "<%=webPath%>";
</script>
<script type="text/javascript" src="json.js"></script>
</head>
<body>
<table width='50%' align='center' style='border:1px solid #DFE8F6;border-collapse:collapse;'>
    <thead>
        <tr>
            <td style="background:#DFE8F6;">编号</td>
            <td style="background:#DFE8F6;">姓名</td>
        </tr>
    </thead>
    <tbody>
    <%
        Map<String,String> tmp_map = null;
        String val = null, id = null;
        for (int i=0; i<list.size(); i++){
        	tmp_map = list.get(i);
        	out.print("<tr>");
        	for (String key : tmp_map.keySet()){
        		val = tmp_map.get(key);
        		id = key + "_" + i;
        		out.print("<td style='border:1px solid #DFE8F6;'>");
        		out.print("<input type='text' id='" + id + "' value='" + val + "' style='width:100%;padding:0px 0px 0px 0px;'/>");
        		out.print("</td>");
        	}
        	out.print("</tr>");
        }        
    %>
    <tr>
        <td colspan="2" align="right">
            <input type="button" value="保存" onclick="saveData()"/>
        </td>
    </tr>
    </tbody>
</table>
</body>
</html>